<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app" class="app">
    <h1 v-html="name"></h1>
    <h2 v-on:click="ageOnClick">{{age}}</h2>
</div>
<script src="./mvvm-master/js/compile.js"></script>
<script src="./mvvm-master/js/observer.js"></script>
<script src="./mvvm-master/js/watcher.js"></script>
<script src="./mvvm-master/js/mvvm.js"></script>
<!--<script>
    let div = document.getElementById("app");
    let attrs = div.attributes;
    Array.prototype.slice.call(attrs).forEach((item)=>{
        // item.name = "id"//"class"
        // item.value = "app"//"app"
    })
</script>-->
<script>
    const vm = new MVVM({
        el: "#app",
        data: {
            name: "你好世界",
            age: 18
        },
        methods:{
            ageOnClick(){
                //this==>vm   vm.name
                alert(this.name)
            }
        }
    });


  /*  setTimeout(()=>{
        vm.name = "世界你好"
    },3000)*/


    /*let b = null
    let a = b || "";
    console.log(a);*/
</script>
</body>
</html>